<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
	body {
    font-family: Arial, sans-serif;
    background-color: #f5f5f5;
    margin: 0;
    padding: 20px;
}

.table-container {
    width: 100%;
    max-width: 1000px;
    margin: auto;
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

th, td {
    padding: 15px;
    height: 50px;
    border: 1px solid #000;
}

th {
    background-color: #333;
    color: #fff;
}

td {
    background-color: #fff;
}

.button {
    padding: 8px 15px;
    border: none;
    border-radius: 4px;
    background-color: #5cb85c;
    color: white;
    cursor: pointer;
    transition: background-color 0.3s;
}

.button:hover {
    background-color: #4cae4c;
}

.delete-button {
    background-color: #d9534f;
}

.delete-button:hover {
    background-color: #c9302c;
}

a {
    color: #337ab7;
    text-decoration: none;
    transition: color 0.3s;
}

a:hover {
    color: #23527c;
}
</style>
</head>
<body>
    <div class="table-container">
        <table>
            <tr>
                <th>供应商编号</th>
                <th>供应商名称</th>
                <th>操作</th>
            </tr>
            <c:forEach items="${providerList}" var="provider">
                <tr>
                    <td style="text-align:center;">${provider.providerId}</td>
                    <td style="text-align:center;">${provider.providerName}</td>
                    <c:if test="${provider.providerId == 1}">
                        <td>默认供应商，不可操作</td>
                    </c:if>
                    <c:if test="${provider.providerId != 1}">
                        <td>
                            <button class="button" onclick="edit('${provider.providerId}')">修改</button>
                            &nbsp;&nbsp;&nbsp;
                            <button class="button delete-button" onclick="del('${provider.providerId}')">删除</button>
                        </td>
                    </c:if>
                </tr>
            </c:forEach>
            <tr>
                <td colspan="3" class="text-center">
                    <a href="admin_addProvider.jsp">添加</a>&nbsp;&nbsp;&nbsp;
                    <a href="adminIndex.jsp">返回</a>
                </td>
            </tr>
        </table>
    </div>
</body>
<script src="../js/jquery.min.js"></script>
<script src="../js/layer/layer.js"></script>
<script type="text/javascript">
	function edit(providerId){
		window.location.href="AdminUpdateProviderServlet?providerId="+providerId;
	}
	function del(providerId){
		$.post("AdminDeleteProviderServlet",{
			providerId:providerId
		},function(data){
			if(data="OK"){
				layer.msg("删除成功");
				setTimeout("move()",2000);
			} else {
				layer.msg("删除失败");
			}
		})
	}
	function move(){
		window.location.href="AdminProviderServlet";
	}
</script>
</body>
</html>